<!--
 * @Author: your name
 * @Date: 2020-12-08 16:59:25
 * @LastEditTime: 2020-12-08 17:00:15
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: \vue_shop\src\components\NewActivites.vue
-->
<template>
  <div>
    申请活动
    <el-upload class="upload-demo" ref="upload" action="" :on-change="handleChange" :file-list="fileList"
      :auto-upload="false" name="file" :limit="1">
      <el-button slot="trigger" size="small" type="primary">选取文件</el-button>
      <el-button style="margin-left: 10px;" size="small" type="success" @click="submitUpload">上传到服务器</el-button>
      <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
    </el-upload>
  </div>
</template>
<script>
  export default {
    data() {
      return {
        fileList: []
      };
    },
    methods: {
      submitUpload: async function () {
        var formData = new FormData();
        console.dir(this.fileList);
        formData.append('file', this.fileList[0])
        console.dir(formData);

        let config = {
          headers: {
            'Content-Type': 'multipart/form-data'
          }
        }
        const {
          data: res
        } = await this.$http.post('/files/upload', formData, config)
        if (res.meta.success == false) return this.$message.error(res.meta.message)
        console.log(res);
        this.fileList.pop()

      },
      handleChange(file) {
        this.fileList.push(file.raw)
        console.log(this.fileList);
      }
    }
  }

</script>

<style lang="less">

</style>
